<script lang="tsx">
import { ref } from "vue";
import "./index.scss";
import useRender from "@/utils/hooks/render";
import ProList from "@/components/ProList/index.vue";

type DataItem = {
  id: number;
  title: string;
  date: string;
};

export default {
  setup(p, c) {
    const getData = async (
      { currPage, pageSize },
      nodataCB
    ): Promise<DataItem[]> => {
      console.log("getData", currPage, pageSize);

      return await new Promise((res, rej) => {
        setTimeout(() => {
          const _items = Array.from({ length: pageSize }, (el, idx) => ({
            id: +new Date(),
            title: `title-${pageSize * (currPage - 1) + idx}`,
            date: "" + new Date(),
          }));
          res(_items);

          // if (items.value.length > 30) nodataCB();
        }, 3000);
      });
    };

    useRender(() => (
      <div class="uno-h90vh container">
        <ProList request={getData}>
          {{
            default: (el) => (
              <div class="uno-h100rpx" key={el.title}>
                {el.title}-tttt
              </div>
            ),
          }}
        </ProList>
      </div>
    ));

    return {};
  },
};
</script>

<style lang="scss"></style>
